<template>
	<view class="container">
		<uni-card title="物流公司" extra="工作人员(张三)" style="margin-top: 0px;">
			<view class="item" style="margin-left: 10px;">
				<view class="">快递名称：{{item.title}}</view>
				<view class="">地址：{{item.address}}</view>
				<view class="">联系方式：{{item.phone}}</view>
			</view>
		</uni-card>
		<uni-card title="预约寄件" extra="工作人员上门服务" style="margin-top: 10px;">
			<view class="" style="display: flex;align-items: center;margin-top: 0px;">
				<view class="tag">物品类型：</view>
				<uni-easyinput v-model="user.t1" placeholder="请输入物品类型" />
			</view>
			<view class="" style="display: flex;align-items: center;margin-top: 20px;">
				<view class="tag">寄件人地址：</view>
				<uni-easyinput v-model="user.t2" placeholder="请输入寄件人地址" />
			</view>
			<view class="" style="display: flex;align-items: center;margin-top: 20px;">
				<view class="tag">寄件人姓名：</view>
				<uni-easyinput v-model="user.t3" placeholder="请输入寄件人姓名" />
			</view>
			<view class="" style="display: flex;align-items: center;margin-top: 20px;">
				<view class="tag">寄件人电话：</view>
				<uni-easyinput v-model="user.t4" maxlength="11" type="number" placeholder="请输入寄件人电话" />
			</view>
			<view class="line"></view>
			<view class="" style="display: flex;align-items: center;margin-top: 0px;">
				<view class="tag">取件人姓名：</view>
				<uni-easyinput v-model="user.t5" placeholder="请输入取件人姓名" />
			</view>
			<view class="" style="display: flex;align-items: center;margin-top: 20px;">
				<view class="tag">取件人电话：</view>
				<uni-easyinput v-model="user.t6" maxlength="11" type="number" placeholder="请输入取件人电话" />
			</view>
			<view class="" style="display: flex;align-items: center;margin-top: 20px;">
				<view class="tag">取件人地址：</view>
				<uni-easyinput v-model="user.t7" placeholder="请输入取件人地址" />
			</view>
		</uni-card>
		<button type="primary" @click="submit" style="margin-top: 20px;">提交</button>
		<uni-popup ref="popup" type="dialog">
			<uni-popup-dialog content="价格大约11元" message="成功消息" :duration="2000" :before-close="true" @close="close"
				@confirm="confirm"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				item: {},
				user: {
					t1: "",
					t2: "",
					t3: "",
					t4: "",
					t5: "",
					t6: "",
					t7: "",
				}
			};
		},
		onNavigationBarButtonTap() {
			uni.makePhoneCall({
				phoneNumber: "12345678911"
			})
		},
		onLoad(item) {
			this.item = JSON.parse(item.data)
		},
		onReady() {

		},
		onShow() {

		},
		methods: {
			submit() {
				this.isEmpty(this.user)
				this.$refs.popup.open()
			},
			/**
			 * 点击取消按钮触发
			 * @param {Object} done
			 */
			close() {
				// TODO 做一些其他的事情，before-close 为true的情况下，手动执行 close 才会关闭对话框
				// ...
				this.$refs.popup.close()
			},
			/**
			 * 点击确认按钮触发
			 * @param {Object} done
			 * @param {Object} value
			 */
			confirm(value) {
				this.$refs.popup.close()
				// 输入框的值
				console.log(value)
				// TODO 做一些其他的事情，手动执行 close 才会关闭对话框
				// ...
				uni.showToast({
					title: '提交成功',
					icon: 'none'
				});
				setTimeout(function() {
					uni.navigateBack({
						delta: 1
					});
				}, 400);
			}
		}
	};
</script>

<style lang="scss">
	.tag {
		width: 6em;
	}
</style>
